<template>
  <customDrawer title="设置快捷操作" ref="customDrawerSetMenuQuick" :widthPx="600" :heightPx="winH" @show="_dialogShow" @confirm="_confirm" :autoHide="false" attach="body" placement="right">
    <template #content>
      <FortenVxetableStatic :data="menuList" :columns="columnList" pkName="id"
                            :searchFieldArr="['title']"
                            searchPlaceholder="搜索菜单名称"
                            :defaultSort="defaultSort"
                            :maxHeight="winH"
                            ref="menuTable"
      ></FortenVxetableStatic>
    </template>
  </customDrawer>
</template>

<script>

import FortenVxetableStatic from "@/components/common/FortenVxetableStatic.vue";

export default {
  desc: '设置快捷操作',
  name: 'setMenuQuick',
  props: {
  },
  mounted() {
    this.load()
  },
  data() {
    return {
      menuList: [],
      menuListUser: [],
      winH: window.innerHeight,

      columnList: [
        {field: 'title', title: '菜单', width: 300,  sortable: false},
        {
          field: 'isShow', title: '展示', width: 100, sortable: false,
          editRender: {name: 'ElSwitch'},
          formatter: 'formatSwitch',
          titleHelp: '勾选后，将展现在快捷面板',
          filter: true
        },
        {
          field: 'sortNum',
          title: '展示顺序',
          width: 100,
          sortable: true,
          editRender: {name: 'ElInputNumber', attrs: {min: 0, max: 999}},
          titleHelp: '在快捷面板的显示顺序'
        },
      ],

      defaultSort: {
        field: 'sortNum',
        order: 'asc',
      }
    }
  },
  computed: {
    cpMenuList() {
       this.menuList.forEach(item => {
        if (item.sortNum == undefined) {
          item.sortNum = 0
        }
        if (item.isShow == undefined) {
          this.$set(item, 'isShow', false)
        }
        if (this.menuListUser != null && this.menuListUser.length > 0 && this.menuListUser.findIndex(menuUser => menuUser.typeKey == item.route) != -1) {
          let findIndex = this.menuListUser.findIndex(menuUser => menuUser.typeKey == item.route)
          this.$set(item, 'isShow', true)
          item.sortNum = this.menuListUser[findIndex].sortNum
        } else {
          this.$set(item, 'isShow', false)
        }
      })
      console.log('this.menuList', this.menuList)
      return this.menuList
    }
  },
  components: {
    FortenVxetableStatic
  },
  methods: {
    _dialog() {
      return this.$refs.customDrawerSetMenuQuick
    },
    _dialogShow() {
    },

    // 确认
    _confirm() {
      let list = this.menuList.filter(item => item.isShow)
      this.utilMessage.confirm('确定保存快捷方式调整？', () => {
        this._save(list)
      })
    },

    // 保存
    _save(list) {
      this.utilVue.loadShow(true)

      let index = 1
      let listSave = []
      if (list && list.length > 0) {
        list.forEach(item => {
          if (item.sortNum == undefined || item.sortNum == 0) {
            item.sortNum = index
          }
          listSave.push(
            {
              flagType: 'menu',
              typeKey: item.route,
              title: item.title,
              icon: item.icon,
              height: -1,
              width: -1,
              sortNum: item.sortNum,
            }
          )

          index += 10
        })
      }

      this.$ajax.post('/sys/workbench/saveBatchMenu', listSave).then(resp => {
        this.utilVue.loadHide()
        if (resp.code == 0) {
          this.utilMessage.success(resp.msg)
          this.hide()
          this.$emit('change')
        }
      })
    },
    show() {
      this._dialog().show()
    },
    hide() {
      this._dialog().hide()
    },
    setUserMenuList(list) {
      this.menuListUser = list
      this.menuList.forEach(item => {
        if (item.sortNum == undefined) {
          item.sortNum = 0
        }
        if (item.isShow == undefined) {
          this.$set(item, 'isShow', false)
        }
        if (this.menuListUser != null && this.menuListUser.length > 0 && this.menuListUser.findIndex(menuUser => menuUser.typeKey == item.route) != -1) {
          let findIndex = this.menuListUser.findIndex(menuUser => menuUser.typeKey == item.route)
          this.$set(item, 'isShow', true)
          item.sortNum = this.menuListUser[findIndex].sortNum
        } else {
          this.$set(item, 'isShow', false)
        }
      })
    },
    // 加载数据
    load() {
      this.$ajax.get('/program/menu/getUserMenu', {
      }).then(response => {
        if (response.code == 0) {
          let menuIdList = response.data.filter(item =>  item.isHidden || item.isAdminMenu).map(item => {
            return item.id
          })

          let menuList = JSON.parse(JSON.stringify(response.data)).filter(
            item =>
              !item.isHidden
              && !item.isAdminMenu
              && !menuIdList.includes(item.parentId)
              && (this.strings.isBlank(item.menuType) || item.menuType.toLowerCase().indexOf('app') == -1)
              && this.strings.isNotBlank(item.url)
              && (item.url.indexOf('.vue') != -1 || item.url.indexOf('report') != -1)
              && response.data.findIndex(tmp => tmp.parentId == item.id) == -1
          )

          menuList.forEach(item => {
            if (item.sortNum == undefined) {
              item.sortNum = 0
            }
            if (item.isShow == undefined) {
              this.$set(item, 'isShow', false)
            }
          })
          this.menuList = menuList
        }
      })
    }
  }
}
</script>

<style lang="scss">
</style>
